<template>
	<view class="content">
		<view class="list">
			<!-- v-for="(item, index) in goodsList" :key="index" -->
			<view class="goods-item">
				<view>商品名：{{ orderDetail.goodsDetail.name || '' }}</view>
				<!-- <view>价格：{{ orderDetail.price / 100 }}元</view> -->
			</view>
		</view>
		<view class="order-info">
			<view>
				<view>总金额：{{ orderDetail.totalFee / 100 }}元</view>
				<view v-if="orderDetail.status">订单状态：{{ statusText[orderDetail.status - 1] }}</view>
			</view>
		</view>
		<view class="gopaybtn">
			<!-- #ifndef H5 -->
			<button v-if="status !== 2" type="primary" @click="pay">非H5支付</button>
			<!-- #endif -->
			
			<!-- #ifdef H5 -->
			<button v-if="!codeUrl && status !== 2" type="primary" @click="pay">H5获取支付二维码</button>
			<template v-if="codeUrl && status !== 2">
				<image :src="'http://qr.liantu.com/api.php?text=' + codeUrl" mode="widthFix"></image>
				<button type="primary" @click="orderQuery">我已完成支付</button>
			</template>
			<!-- #endif -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderDetail:{
					goodsDetail:{
						name:'',
						totalFee:0,
						status:0
					}
				},
				status:0,
				statusText: ['未支付', '已支付'],
				codeUrl: '',
			}
		},
		onLoad(options) {
			let orderNo = options.orderNo
			this.orderNo = orderNo
			uni.showLoading({
				title: '正在获取商品列表',
				mask: true
			})
			
			this.$request('order','get-order-detail',{
				orderNo
			}).then(res=>{
				uni.hideLoading()
				if(res.code === 0){
					this.orderDetail = res;
				}
				
			}).catch((err)=>{
				uni.hideLoading()
				uni.showModal({
					content: err.message || '获取商品订单失败',
					showCancel: false
				})
			})
			
			// uniCloud.callFunction({
			// 	name: 'get-order-detail',
			// 	data: {
			// 		outTradeNo
			// 	}
			// }).then((res) => {
			// 	uni.hideLoading()
			// 	if (res.result.goodsList && res.result.goodsList.length > 0) {
			// 		this.goodsList.splice(0, 0, ...res.result.goodsList)
			// 		this.totalFee = res.result.totalFee
			// 		this.status = res.result.status
			// 	} else {
			// 		throw new Error('获取商品列表失败')
			// 	}
			// }).catch((err) => {
			// 	uni.hideLoading()
			// 	uni.showModal({
			// 		content: err.message || '获取商品列表失败',
			// 		showCancel: false
			// 	})
			// })
		},
		methods: {
			// #ifdef H5
			pay() {
				console.log('h5支付')
				// const providerList = ['wxpay','alipay']
				// let selectedProvider = ''
				// new Promise((resolve, reject) => {
				// 	uni.showActionSheet({
				// 		itemList: providerList,
				// 		success(res) {
				// 			resolve(providerList[res.tapIndex])
				// 		},
				// 		fail() {
				// 			reject(new Error('取消支付'))
				// 		}
				// 	})
				// }).then((provider) => {
				// 	selectedProvider = provider
				// 	return uniCloud.callFunction({
				// 		name: 'pay',
				// 		data: {
				// 			provider,
				// 			outTradeNo: this.outTradeNo
				// 		}
				// 	})
				// }).then((res) => {
				// 	console.log(res);
				// 	this.codeUrl = res.result.orderInfo.codeUrl
				// }).catch((err) => {
				// 	uni.showModal({
				// 		content: err.message || '获取支付二维码失败',
				// 		showCancel: false
				// 	})
				// })
			},
			orderQuery() {
				uniCloud.callFunction({
					name: 'order-query',
					data: {
						outTradeNo: this.outTradeNo
					}
				}).then((res) => {
					if (res.result.orderPaid) {
						this.status = 2
						uni.showModal({
							content: '订单已支付',
							showCancel: false
						})
					} else {
						uni.showModal({
							content: '订单未支付',
							showCancel: false
						})
					}
				}).catch((e) => {
					uni.showModal({
						content: '查询订单状态失败，请稍后再试',
						showCancel: false
					})
				})
			},
			// #endif
			// #ifndef H5
			pay() {
				console.log('非h5支付')
				// let selectedProvider = ''
				// new Promise((resolve, reject) => {
				// 	uni.getProvider({
				// 		service: 'payment',
				// 		success(res) {
				// 			resolve(res.provider)
				// 		},
				// 		fail() {
				// 			reject(new Error('获取支付方式失败'))
				// 		}
				// 	})
				// }).then((providerList) => {
				// 	return new Promise((resolve, reject) => {
				// 		uni.showActionSheet({
				// 			itemList: providerList,
				// 			success(res) {
				// 				resolve(providerList[res.tapIndex])
				// 			},
				// 			fail() {
				// 				reject(new Error('取消支付'))
				// 			}
				// 		})
				// 	})

				// }).then((provider) => {
				// 	selectedProvider = provider
				// 	return uniCloud.callFunction({
				// 		name: 'pay',
				// 		data: {
				// 			provider,
				// 			outTradeNo: this.outTradeNo
				// 		}
				// 	})
				// }).then((res) => {
				// 	console.log(res);
				// 	if (res.result.orderInfo) {
				// 		return new Promise((resolve, reject) => {
				// 			uni.requestPayment({
				// 				// #ifdef APP-PLUS
				// 				provider: selectedProvider,
				// 				// #endif
				// 				// #ifdef MP-WEIXIN
				// 				...res.result.orderInfo,
				// 				// #endif
				// 				// #ifdef APP-PLUS || MP-ALIPAY
				// 				orderInfo: res.result.orderInfo,
				// 				// #endif
				// 				complete() {
				// 					resolve(res.result.outTradeNo)
				// 				}
				// 			})
				// 		})
				// 	} else {
				// 		throw new Error(res.result.msg)
				// 	}
				// }).then((outTradeNo) => {
				// 	return uniCloud.callFunction({
				// 		name: 'order-query',
				// 		data: {
				// 			outTradeNo
				// 		}
				// 	})
				// }).then((res) => {
				// 	if (res.result.orderPaid) {
				// 		this.status = 2
				// 		uni.showModal({
				// 			content: '订单已支付',
				// 			showCancel: false
				// 		})
				// 	} else {
				// 		uni.showModal({
				// 			content: '订单未支付',
				// 			showCancel: false
				// 		})
				// 	}
				// }).catch((err) => {
				// 	uni.showModal({
				// 		content: err.message || '支付失败',
				// 		showCancel: false
				// 	})
				// })

			}

			// #endif
		}
	}
</script>

<style>
	.gopaybtn{
		margin-top: 40rpx;
	}
</style>
